<template>
	<sc-dialog v-model="visible" :title="titleMap[mode]" show-fullscreen width="600px" @close="close">
		<el-form ref="formRef" label-width="100px" :model="formData" :rules="rules">
			<el-form-item label="产线名称" prop="lineName">
				<el-input v-model.trim="formData.lineName" disabled :style="{ width: '100%' }"></el-input>
			</el-form-item>
			<el-form-item label="工位编号" prop="opCode">
				<el-input
					v-model.trim="formData.opCode"
					placeholder="请输入工位编号"
					:maxlength="30"
					show-word-limit
					clearable
					:disabled="mode == 'edit'"
					:style="{ width: '100%' }"></el-input>
			</el-form-item>
			<el-form-item label="工位名称" prop="opName">
				<el-input
					v-model.trim="formData.opName"
					placeholder="请输入工位名称"
					:maxlength="30"
					show-word-limit
					clearable
					:style="{ width: '100%' }"></el-input>
			</el-form-item>
			<el-form-item label="工位属性" prop="attr">
				<el-radio-group v-model="formData.attr">
					<el-radio
						v-for="item in attrOptions"
						:key="item.value"
						:label="item.value"
						>{{ item.label }}</el-radio
					>
				</el-radio-group>
			</el-form-item>
			<el-form-item label="工位归属" prop="classify">
				<el-radio-group v-model="formData.owner">
					<el-radio
						v-for="item in ownerOptions"
						:key="item.value"
						:label="item.value"
						>{{ item.label }}</el-radio
					>
				</el-radio-group>
			</el-form-item>
			<el-form-item label="工位分类" prop="classify">
				<el-radio-group v-model="formData.classify">
					<el-radio
						v-for="item in classifyOptions"
						:key="item.value"
						:label="item.value"
						>{{ item.label }}</el-radio
					>
				</el-radio-group>
			</el-form-item>
		</el-form>

		<template #footer>
			<el-button @click="close">取 消</el-button>
			<el-button :loading="isSaveing" type="primary" @click="save"> 确 定 </el-button>
		</template>
	</sc-dialog>
</template>

<script>
export default {
	data() {
		return {
			mode: "add",
			titleMap: {
				add: "新增",
				edit: "编辑",
			},
			isSaveing: false,
			visible: false,
			attrOptions: [],
			ownerOptions: [],
			classifyOptions: [],
			formData: {
				id: 0,
				opCode: '',
				opName: '',
				lineId: 0,
				lineCode: '',
				lineName: '',
				attr: 1,
				owner: 1,
				classify: 1,
			},
			rules: {
				opCode: [{ required: true, message: "请输入工位编号", trigger: "blur" }],
				opName: [{ required: true, message: "请输入工位名称", trigger: "blur" }],
				attr: [{ required: true, message: "请选择工位属性", trigger: "blur" }],
				owner: [{ required: true, message: "请选择工位归属", trigger: "blur" }],
				classify: [{ required: true, message: "请选择工位分类", trigger: "blur" }],
			},
		};
	},
	methods: {
		async open(row, type = "edit") {
			if (type == "add") {
				this.mode = type;
				this.formData.lineId = row.id;
				this.formData.lineCode = row.lineCode;
				this.formData.lineName = row.lineName;
			} else {
				this.mode = type;
				const resp = await this.$API.mdstation.model.get(row.id);
				this.formData = resp.data;
			}
			this.visible = true;

			const resp1 = await this.$API.enumlist.model.get('opAttrEnum');
			this.attrOptions = resp1.data;

			const resp2 = await this.$API.enumlist.model.get('opClassifyEnum');
			this.classifyOptions = resp2.data;

			const resp3 = await this.$API.enumlist.model.get('opOwnerEnum');
			this.ownerOptions = resp3.data;
		},
		save() {
			this.$refs.formRef.validate(async (valid) => {
				if (valid) {
					this.isSaveing = true;
					let res = null;
					if (this.formData.id === 0) {
						res = await this.$API.mdstation.add.post(this.formData);
					} else {
						res = await this.$API.mdstation.update.put(this.formData);
					}
					this.isSaveing = false;
					if (res.code == 200) {
						this.$emit("complete");
						this.visible = false;
						this.$message.success("操作成功");
					} else {
						this.$alert(res.message, "提示", { type: "error" });
					}
				}
			});
		},
		close() {
			this.formData = {
				id: 0,
				opCode: '',
				opName: '',
				lineId: 0,
				lineCode: '',
				lineName: '',
				attr: 1,
				owner: 1,
				classify: 1,
			};
			this.$refs.formRef.resetFields();
			this.visible = false;
		},
	},
};
</script>
